@import url("https://fonts.googleapis.com/css2?family=Anta&display=swap");
body {
background-color: #36454f;
color: white;
font-family: 'Anta', sans-serif;
padding: 20px;
border: 5px solid gray;
font-size: 17px;
}
h1 {
font-size: 55px;
text-align: center;
font-weight: bold;
text-shadow: 3px 3px 1px gray;
}
h2 {
font-size: 30px;
}
h3{
font-size: 27px;
text-align: center;
}
h4 {
font-size: 22px;
text-align: center;
}
p {
padding: 10px 10px 10px 10px;
border: 3px solid gray;
}
pre {
background-color: lightgray;
border: 5px solid gray;
max-height: 250px;
overflow-y: auto;
}
.scroll-500 {
max-height: 500px;
overflow-y: auto;
}
I created my GitHub account, from there I created a repository and
named it “stats220”. I created a README.md file when creating my
repository, in my Readme file I used three different types of headers,
two types of bullet points and links to other websites. Within the
Readme file I also used Bold and
Italics.
The link to my repo is:
My Repo
I also created a GitHub website. I did this by creating a RMD file
that I named “index.Rmd”, I decided to use the same content that is in
this RMD file for my website. I then knit the file into a HTML and
uploaded it to my repo. From there I set-up GitHub pages and made my
website live.
The link to my stats220 website is:
My Website
This is a screenshot of my project folder I created on my
computer:
I decided to use this style of meme.
The key features of the meme that I re-created were the images on the
right which I managed to do with images I found online. I also added
text next to the images like in the inspiration picture.
The key features that I changed when making my own meme was using
different pictures than the ones in the inspiration picture. I also
changed the images from the right side to the left. I only used three
images in my meme instead of four. I decided to change the white
background to black and I used white text.
library(magick)
inspo_meme.url = "https://pbs.twimg.com/media/DP9beedX4AAvrwo.jpg"
inspo_meme = image_read(inspo_meme.url)
#image_write(inspo_meme, "inspo_meme.png")
#Links to all images used in my meme
im1.url = "https://i.imgflip.com/1lgr72.jpg?a463272"
im2.url = "https://pyxis.nymag.com/v1/imgs/42d/c5a/53aaae864601cd024b2dd1fddaa6a0839a-15-exploding-brain-meme.rsquare.w400.jpg"
im3.url = "https://i1.sndcdn.com/artworks-lyidNFrSCzymr7fo-mmlyoQ-t500x500.jpg"
#Creating a blank square for the right side of the meme
blank_square = image_blank(380, 306, color = "black") %>%
image_border(color = "white", geometry = "2.5x2.5")
#Creating square 1,2 and 3 with the imported images for the left side of the meme
sq1 = image_read(im1.url) %>%
image_scale("x300") %>%
image_border(color = "black",
geometry = "28x2.5") %>%
image_border(color = "white",
geometry = "2.5x2.5")
sq2 = image_read(im2.url) %>%
image_scale("x300") %>%
image_border(color = "black",
geometry = "2.5x2.5") %>%
image_border(color = "white",
geometry = "2.5x2.5")
sq3 = image_read(im3.url) %>%
image_scale("x300") %>%
image_border(color = "black",
geometry = "2.5x2.5") %>%
image_border(color = "white",
geometry = "2.5x2.5")
#Creating square 4,5 and 6 with text for the right side of the meme
sq4 = blank_square %>%
image_annotate(text = "Using R to\n analyse data",
color = "white",
font = "Impact",
size = 55,
gravity = "center")
sq5 = blank_square %>%
image_annotate(text = "Using R to\n make statistical\n graphs",
color = "white",
font = "Impact",
size = 55,
gravity = "center")
sq6 = blank_square %>%
image_annotate(text = "Using R to\n make memes",
color = "white",
font = "Impact",
size = 55,
gravity = "center")
#Creating two vectors for the left and right sides of the meme
left_side = image_append(c(sq1,sq2,sq3),
stack = TRUE)
right_side = image_append(c(sq4,sq5,sq6),
stack = TRUE)
#Putting the two sides of the meme together
meme = image_append(c(left_side, right_side)) %>%
image_scale("500x")
image_write(meme, "my_meme.png") #Writing the meme to a png file
meme #Running the meme
#Animation Code
frame1 = image_append(c(sq1,blank_square))
frame2 = image_append(c(sq1,sq4))
frame3 = image_append(c(sq2,blank_square))
frame4 = image_append(c(sq2,sq5))
frame5 = image_append(c(sq3,blank_square))
frame6 = image_append(c(sq3,sq6))
frames = c(frame1, frame2, frame2, frame3, frame4,
frame4, frame5, frame6, frame6)
gif = image_morph(frames) %>%
image_animate(fps = 10)
image_write(gif, "my_animation.gif")
I believe that my project demonstrates creativity, when changing the
CSS for my HTML I managed to make the page look unique with different
fonts, colors and by changing the layout of different sections of the
page. I also changed the maximum height of the code chunks which allows
them to be scrolled through in the html.
I also created a GitHub website. I uploaded my project to my GItHub
repo, from there I configured my pages on GitHub and turned my page into
a website.
The one important idea that I have learnt from Module 1, is how
complicated it is creating an HTML. When I was working through this
project I began to understand how many different steps and processes
there are when developing HTML for a web page. There is so many things
that you can change, and through this project I realised that I have
barely scratched the surface.
I am interested in using R, or a similar program, to analyse and report
on pieces of data. I am excited to use R and RMD to visualise data and
then convert that data into HTML so that it can be displayed on a web
page.